<template>
  <div>
    <div class="all-wrap">
      <div class="all-title">浏览数据管理</div>
    </div>
    <el-table :data="messageList" border style="width: 100%">
      <el-table-column type="index" width="50" />
      <el-table-column prop="scene" label="场景"  > </el-table-column>
      <el-table-column prop="message" label="浏览器信息" />
      <el-table-column prop="add_time" label="访问时间" >
      </el-table-column>
    </el-table>
    <el-pagination v-model:current-page="currentPage" :page-size="10" layout="total, prev, pager, next" :total="dataTotal"
      @current-change="handleCurrentChange" />
  </div>
</template>
<script lang="ts" setup>
import { ref, reactive, onMounted } from 'vue'
import { ElMessage, FormInstance } from 'element-plus'
import { getMessageList } from '../apis/user'
const ruleFormRef = ref<FormInstance>()
interface opytion {
  id: number
  singerName: string
}
let messageList = ref<opytion[]>([])
let dataTotal=ref(0)
let currentPage=ref(0)

const getDataList = async () => {
  let res = await getMessageList({page: currentPage.value, pageSize: 10 })
  if (res.status == 200) {
    messageList.value = res.data.data
    dataTotal.value = res.data.total
  }
}
const handleCurrentChange=()=>{
  getDataList()
}
onMounted(() => {
  getDataList()
})
</script>
<style lang="less" scoped>
.top-controllers {
  width: 100%;
  height: 30px;

  .w-50 {
    width: 200px;
    margin-right: 20px;
  }
}
</style>